<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>地址详情</title>

        <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
        <meta name="renderer" content="webkit">
        <meta http-equiv="Cache-Control" content="no-siteapp"/>
        <script type="text/javascript" src="/Public/Member/js/jquery.min.js"></script>
        <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
        <script type="text/javascript">
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: '{$wxConfig.appId}', // 必填，公众号的唯一标识
                timestamp: {$wxConfig.timestamp}, // 必填，生成签名的时间戳
                nonceStr: '{$wxConfig.nonceStr}', // 必填，生成签名的随机串
                signature: '{$wxConfig.signature}',// 必填，签名，见附录1
                jsApiList: [
                    'openLocation',
                    'getLocation'
                ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
            });
        </script>


        <link rel="stylesheet" href="/Public/Member/css/base.css">

        <style>
            html{overflow-x: hidden;font-size: 60%;}
            body{background: #fff;font-family: "微软雅黑";}
            .nav-ul{width: 100%;text-align:center;background: #f5f5f5;}
            .nav-ul td{}
            .nav-ul a{color: #999999;font-size: 2rem;line-height: 4.5rem;display: inline-block;width: 100%;background: url('/Public/Member/images/nav-ul-li-bg.png') 0rem 0.7rem no-repeat;}
            .nav-ul td:first-child a{background: none;}
            .nav-ul td{border-bottom: 2px #dddddd solid;width: 25%;}
            .nav-ul a.on{border-bottom: 4px #333 solid;margin-bottom: -2px; color: #333;}

            .me-postion{padding: 1.5rem;background: #fff;}
            .me-postion h3{color: #333;font-weight: normal;font-size: 2.5rem;line-height: 3rem;}
            .me-postion p{color: #999999; font-size: 1.8rem}
            #allmap {width: 100%;height: 30rem;overflow: hidden;margin:0;}
            @media (max-device-width: 780px){#golist{display: block !important;}}
        </style>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=wAdaxIFnGrRdBLHB5WcVrvKX"></script>
    </head>

    <body>
        <table class="nav-ul">
            <tr>
            <volist name="brand" id="vo">
                <td>
                    <a href="{:U('Store/index',array('bid'=>$vo['id']))}"
                       <if condition="($vo['id'] eq I('bid')) or ($vo['id'] eq $bid)">class="on"</if>>
                        {$vo.bname}</a>
                </td>
            </volist>
        </tr>
    </table>

    <div class="bdmap" id="allmap">

    </div>

    <div class="me-postion">
        <h3>我的位置</h3>
        <p>读取中....</p>
    </div>


    <script type="text/javascript">
        // 百度地图API功能
/*        var map = new BMap.Map("allmap");            // 创建Map实例
        var point = new BMap.Point(116.404, 39.915); // 创建点坐标
        map.centerAndZoom(point, 15);                 // 初始化地图,设置中心点坐标和地图级别。
        map.addControl(new BMap.ZoomControl());      //添加地图缩放控件*/
    </script>

    <script type="text/javascript">

var shop_lng = "{:I('lon')}";
var shop_lat = "{:I('lat')}";

// 百度地图API功能
var map = new BMap.Map("allmap");
//默认位置-店铺位置
map.centerAndZoom(new BMap.Point(shop_lng, shop_lat), 11);


wx.ready(function () {
     

      wx.getLocation({
          success: function (res) {
              var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
              var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
              var speed = res.speed; // 速度，以米/每秒计
              var accuracy = res.accuracy; // 位置精度


              


//我的位置
var start = new BMap.Point(longitude,latitude);      
//店铺位置
var end = new BMap.Point(shop_lng,shop_lat);

//转化地址
var geoc = new BMap.Geocoder();
geoc.getLocation(start, function(rs){
	$(".me-postion").find("p").text(rs.address);
});

var driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
driving.search(start, end);







          }
      });



      
}); /*wx.ready end*/

	</script>


</body>
</html>  